<!--页面主要内容-->
<main class="lyear-layout-content">

    <div class="container-fluid p-t-15">

        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">

                        <form method="post" class="row" enctype="multipart/form-data">
                            <div class="form-group col-md-12">
                                <label for="name">商品分类名称</label>
                                <input type="text" class="form-control" id="name" name="name" value="{$ProductType.name}"
                                    placeholder="请输入分类名称" />
                            </div>
                            <div class="form-group col-md-12">
                                <label for="weigh">商品分类权重</label>
                                <input type="number" class="form-control" id="weigh" name="weigh" min="1" value="{$ProductType.weigh}"
                                    placeholder="配置的数值" />
                            </div>
                            <div class="form-group">
                                <label for="cover">商品分类图标</label>
                                <div class="input-group" style="display: block;">
                                    <input type="file" class="form-control" name="cover" id="cover"
                                        hidden>
                                    <img class="img" width="200"
                                    src="{$ProductType.cover ? $ProductType.cover : '/static/home/res/images/upload.png'}"
                                        id="img-cover" />
                                    <div class="input-group-append"><button class="btn btn-default"
                                            onclick="upload('#cover','.img')" type="button">上传图片</button>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group col-md-12">
                                <button type="submit" class="btn btn-primary ajax-post"
                                    target-form="add-form">更新</button>
                                <button type="button" class="btn btn-default"
                                    onclick="javascript:history.back(-1);return false;">返 回</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>

        </div>

    </div>

</main>
<!--End 页面主要内容-->
<script>
    layui.use(['layer'], function () {
        let $ = layui.jquery,
            layer = layui.layer
        $('input[name="name"]').change(function () {
            let newName = `{$ProductType['name']}`;
            let name = $(this).val();
           if(newName != name){
                //发起请求
                $.ajax({
                    type: 'post',
                    url: `{:url('admin/product/productsortadd')}`,
                    data: {
                        name,
                        action: "name"
                    },
                    dataType: 'json',
                    success: function (res) {
                        if (res.code === 1) {
                            layer.msg(res.msg, { icon: 1 })
                        } else {
                            layer.msg(res.msg, { icon: 0 })
                        }
                    }
                })
            }
        })    
    })
    // 图片预览函数
    function GetObjectURL(file) {
        // createObjectURL  给一个文件对象 可以提取出一个url本地地址出来
        var url = null;

        //判断是否为IE浏览器还是google还是其他浏览器
        if (window.createObjectURL != undefined) {
            url = window.createObjectURL(file)
        } else if (window.URL != undefined) {
            url = window.URL.createObjectURL(file)
        } else if (window.webkitURL != undefined) {
            url = window.webkitURL.createObjectURL(file)
        }

        return url
    }

    function upload(elem, img) {
        //点击拉起上传选择
        $(elem).click()

        $(elem).change(function () {
            let file = $(this)[0].files[0] ? $(this)[0].files[0] : {}
            // console.log(file)

            let id = $(this).attr('id')
            let url = GetObjectURL(file)
            let imgArr = $(img)
            for (let item of imgArr) {
                let itemid = $(item).attr('id')

                //console.log(item)
                if ('img-' + id == itemid) {
                    $(item).attr('src', url)
                }
            }
        })
    }
    $();

   
</script>